<!-- 单选题 -->

<template>
  <FormSlot :bind="`no_${obj.no}`" tip="请选择" noLabel :required="obj.required === 1">
    <div v-for="item in obj.optionList" :key="item.key" class="flex">
      <ShowSlot flex0>
        <el-radio v-model="form[`no_${obj.no}`]" :label="item.label" :disabled="disabled" />
      </ShowSlot>

      <ShowSlot flex1>
        <ShowImage v-if="!CORE.isEmpty(item.image)" :one="item" noLabel />
        <ShowTextMulti v-if="item.content" :one="item" bind="content" />
      </ShowSlot>
    </div>
  </FormSlot>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'
import props from '../OurItem/props'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'MyRadio',

  /**
   * 属性注册 (抽取以便查阅)
   */
  props,

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    /**
     * 父组件
     */
    parent() {
      return CORE.componentParent(this, 'MyQuestion')
    },

    /**
     * 表单对象
     */
    form() {
      return this.parent.form
    },

    /**
     * 是否禁用
     */
    disabled() {
      return this.parent.disabled
    },
  },

  /**
   * 挂载完成 (先抽取再调用)
   */
  mounted() {
    this.toChange && this.toChange()
  },
}
</script>
